// @ 516
// _(:з」∠)_
// 右侧详情弹窗

require([
    "disDetilas",
    "weatherStation"
], function( disDetilas ) {
    'use strict';

    let rightPanel = {
        'init': function( param ) {
            let _this = this,
                showHide = {
                    disaster: { area: [ 1 ], point: [ 0 ] }
                };

            RST.basic( Path + "/data/basic/rightNav.json", "", function( result ) {
                let data = result.data[ param.panelType ],
                    config = showHide[ param.panelType ][ param.type ];

                if ( data ) {
                    let detilaHead = ``, detilaCont = ``, working_ = [], title = "";

                    for ( let x = 0; x < data.length; x++ ) {
                        for ( let y = 0; y < config.length; y++ ) {
                            if ( data[x].sort != config[y] ) {
                                detilaHead += `<li> <a href="#">${ data[x].title }</a> </li>`;
                                detilaCont += `<div class="rp_item ${ data[x].value }">
                                                            <div class="rp_item_head">${ data[x].name }</div>
                                                            <div class="rp_item_cont"></div>
                                                        </div>`;
                                working_.push( data[x].value );
                            }
                        }
                    }

                    if ( param.type == "area" ) {
                        title = "灾害区域详情";
                    } else {
                        title = "自定义灾害点详情";
                    }

                    let main = document.querySelector(".main"),
                        rightPanel = main.querySelector(".rightPanel"),
                        panelHtml = `<div class="rightPanel">
                                                <div class="rp_head">
                                                    <h>${ title }</h>
                                                    <span class="rp_close"></span>
                                                </div>
                                                <div class="rp_cont">
                                                    <ul class="rp_fixed">
                                                        ${ detilaHead }
                                                    </ul>
                                                    <div class="rp_list">
                                                        ${ detilaCont }
                                                    </div>
                                                </div>
                                                <span class="rp_min_">灾害详情</span>
                                            </div>`;

                    if ( rightPanel ) rightPanel.remove();
                    main.insertAdjacentHTML("beforeEnd", panelHtml);
                    rightPanel = main.querySelector(".rightPanel");

                    // 自动设置head li宽度
                    let litem = rightPanel.querySelectorAll(".rp_fixed li");

                    for ( let x = 0; x < litem.length; x++ ) {
                        litem[x].style.width = "calc( 100% / "+ litem.length +" )";
                        if ( litem.length > 4 ) {
                            litem[x].children[0].addClass("rest");
                        }

                        litem[x].addEventListener( 'click', function(e) {
                            if ( e.target.nodeName == "A" ) {
                                e.target.parentNode.removeAllClass("select");
                                e.target.parentNode.addClass("select");

                                let insetElmt = rightPanel.querySelector("."+working_[x]),
                                    insetElmtCont = insetElmt.querySelector(".rp_item_cont");
                                
                                insetElmt.removeAllClass("select");
                                insetElmt.addClass("select");

                                // 移除小气候站面板
                                let weatherStation = document.querySelector(".weatherStation");
                                if ( weatherStation ) weatherStation.remove();

                                // 加载单项内容窗体
                                _this.setSinglePanel({
                                    type: param.type,
                                    disCrop: param.disCrop,
                                    disArea: param.disArea,
                                    disDate: param.disDate,
                                    disEvent: param.disEvent,
                                    disType: param.disType,
                                    disModel: param.disModel,
                                    insetElmt: insetElmtCont,
                                    className: working_[x],
                                    latlng: param.latlng
                                });
                            }

                            return false;
                        }, false);
                    }

                    // 最小化面板
                    let close = rightPanel.querySelector(".rp_close");
                    close.addEventListener( 'click', function(e) {
                        rightPanel.addClass("min_");
                    }, false);

                    // 最大化面板
                    let min_ = rightPanel.querySelector(".rp_min_");
                    min_.addEventListener( 'click', function(e) {
                        rightPanel.removeClass("min_");
                        litem[0].children[0].click();
                    }, false);
                
                    close.click();
                }
            });
        },
        'setSinglePanel': function( param ) {
            let _this = this;

            if ( param.insetElmt.textContent == "" ) {
                switch( param.className ) {
                    case "disDetilas":
                        disDetilas.init( param );
                    break;
                }  
            }
        }
    }

    window.rightPanel = rightPanel;
    
    return rightPanel;
});